<template>
  <table v-show="list && list.length > 0" class="table table-bordered table-hover">
    <tbody>
      <tr>
        <td>
          <label class="control-label col-sm-2">跳转内容地址</label>
          <div class="col-sm-9">
            {{location}}
          </div>
        </td>
      </tr>
      <tr>
        <td>
          <label class="control-label col-sm-2">券商code</label>
          <div class="col-sm-9">
            {{securityCode}}
          </div>
        </td>
      </tr>
    </tbody>
  </table>
  <table v-show="list && list.length > 0" class="table table-bordered table-hover">
    <caption>{{title}}列表</caption>
    <thead>
      <tr>
        <th>ID</th>
        <th class="col-xs-1">名称</th>
        <th class="col-xs-2">图片</th>
        <!--<th class="col-nowrap dHide">跳转内容地址</th>
        <th class="col-xs-2 dHide">券商code</th>-->
        <th class="text-right">排序</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="it in list">
        <td class="col-nowrap">{{it.id}}</td>
        <td>{{it.name}}</td>
        <td>
          <img class="list-pic" :src="it.picUrl">
        </td>
        <!--<td class="dHide">{{it.location}}</td>
        <td class="dHide">{{it.securityCode}}</td>-->
        <td class="col-nowrap text-right">
          <button v-if="$index !==0 " class="btn btn-sm btn-success btn-move" @click="swap(it.id, list[$index - 1].id)">上移</button><button v-if="$index !== (list.length-1)" class="btn btn-sm btn-success btn-move" @click="swap(it.id, list[$index + 1].id)">下移</button><button class="btn btn-sm btn-move" v-if=" $index >= list.length - 1 " :style="{ opacity: 0, 'pointer-events': 'none' }">占位</button>
        </td>
        <td class="col-nowrap text-right">
          <vue-gao-update :ad="deepClone(it)" :position="position"></vue-gao-update>
          <button class="btn btn-danger btn-sm" @click="deleteAd(it.id)">删除</button>
        </td>
      </tr>
    </tbody>
  </table>
  <vue-pages :pages.sync="pages" :get-list="getList"></vue-pages>
</template>
<style src="./open-ad-list.css" scoped></style>
<script src="./open-ad-list.js"></script>
